<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width='device-width', initial-scale=1.0">
    <title>bilibili会员购</title>
    <link rel="stylesheet" href="../会员购/css/lndex.css">
    <script src="../会员购/js/axios.min.js"></script>
    <link rel="stylesheet" href="../会员购/swiper-8.0.7/swiper8/swiper-bundle.min.css">
    <script src="../会员购/swiper-8.0.7/swiper8/swiper-bundle.min.js"></script>
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_3418409_b08iye0h79l.css">
</head>
<body>
    <div class="nav-big">
        <div class="nav-small">
            <div class="nav-logo"></div>
            <div class="nav-sub">商城</div>
            <div class="nav-icon"></div>
            <div class="nav-mainsite"><a href="https://www.bilibili.com/"
                    style="text-decoration: none; color: #636c7b;">主站</a></div>
            <div class="nav-search">
                <input type="text" name="" id="" placeholder="活动、嘉宾、场馆" name class="nav-search-text">
                <div class="search-icon"></div>
            </div>
            <div id="logAndreg" style="position: relative;left: 100px;">
                <!-- <div class="nav-regis-login">
                    <div class="nav-login"><a href="../会员购/html/register.html">注册</a></div>
                    <div class="nav-login-middle"></div>
                    <div class="nav-register"><a href="../会员购/html/login.html"  style="text-decoration: none; color:#6c637b">登录</a></div>
                </div> -->
            </div>
            <div class="nav-cart">
                <div class="nav-cartIcon"></div>
                <div class="nav-cart-center"><a href="../会员购/html/cart.html" style="text-decoration: none;  color:#6c637b">订单中心</a></div>
            </div>
        </div>
    </div>
    <div class="showhome">
        <div class="showhome-switch">
            <div class="showhome-switch-left">漫展演出</div>
            <div class="showhome-switch-right">B站周边</div>
        </div>
    </div>
    <div class="swiper mySwiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img
                    src="https://i0.hdslb.com/bfs/kfptfe/floor/vane471fa67147454876882b1b679fa6c208.jpg" alt=""></div>
            <div class="swiper-slide"><img
                    src="https://i0.hdslb.com/bfs/kfptfe/floor/vane6f4cb4b4c5864df6bb8b2825b0fbbbf1.jpg" alt=""></div>
        </div>
        <!-- 如果需要导航按钮 -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
        <div class="swiper-pagination"></div>
    </div>
    <div class="selector-wrapper">
        <div class="city-selector">
            <div class="title">城市</div>
            <div class="selector-content">
                <ul class="city-list">
                    <li class="first-city-item">全国</li>
                    <li class="city-item">北京</li>
                    <li class="city-item">成都</li>
                    <li class="city-item">上海</li>
                    <li class="city-item">重庆</li>
                    <li class="city-item">杭州</li>
                    <li class="city-item">广州</li>
                    <li class="city-item">天津</li>
                    <li class="city-item">深圳</li>
                    <li class="city-item">厦门</li>
                    <li class="li-more"><span>更多城市</span></li>
                </ul>
            </div>
        </div>
        <div class="type-selector">
            <div class="type-title">类型</div>
            <div class="selector-content">
                <ul class="type-list">
                    <li class="current-type">
                        <span class="active">
                            全部类型
                        </span>
                    </li>
                    <li class="current-type">
                        <span>
                            演出
                        </span>
                    </li>
                    <li class="current-type">
                        <span>
                            展览
                        </span>
                    </li>
                    <li class="current-type">
                        <span>
                            本地生活
                        </span>
                    </li>
                </ul>
            </div>
        </div>
        <div class="order-selector">
            <div class="type-title">筛选</div>
            <div class="selector-content">
                <ul class="type-list">
                    <li class="current-type">
                        <span class="active">
                            全部时间
                        </span>
                    </li>
                    <li class="current-type">
                        <span>
                            本周
                        </span>
                    </li>
                    <li class="current-type">
                        <span>
                            本月
                        </span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="project-list" id="pdiv">
        
    </div>
    <div class="scroll" onclick="gotop()" style="cursor: pointer;">
        <div class="left">
            <a href="https://show.bilibili.com/platform/feedbacklist.html" target="_blank" class="service"></a>
            <div class="iconfont icon-service" id="serviceimg"></div>
            <div class="scroll-text">建议</div>
            <div class="scroll-top" id="scroll-top">
                <div id="topimg" class="iconfont icon-xiangshang"></div>
                <div class="scroll-text">顶部</div>
            </div>
        </div>
    </div>
    <div class="footer">
        <div class="footer-wrp">
            <div class="border"></div>
            <div class="footer-text">
                <ul class="text-ul">
                    <li class="liclass">
                        <div class="tips">bilibili</div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">关于我们</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">友情链接</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">哔哩哔哩周边</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">官方认证</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">购买须知</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">客服中心</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">联系我们</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">加入我们</a>
                        </div>
                    </li>
                    <li class="liclass">
                        <div class="tips">传送门</div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">帮助中心</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">高级弹幕</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">活动专题页</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">侵权申诉</a>
                        </div>
                        <div class="cards">
                            <a href="https://www.bilibili.com/html/aboutUs.html" target="_blank">活动中心</a>
                        </div>
                    </li>
                    <li class="liclass">
                        <div class="li-right">
                            <div class="phone">
                                <div class="phone-img1"></div>
                                <em>手机端下载</em>
                            </div>
                            <div class="phone">
                                <div class="phone-img2"></div>
                                <em>新浪微博</em>
                            </div>
                            <div class="phone">
                                <div class="phone-img3"></div>
                                <em>官方微信</em>
                            </div>
                        </div>
                    </li>
                </ul>
                <div class="partner">
                    <div class="partner-img">
                        <div class="partner-banner"></div>
                    </div>
                </div>
                <img src="../会员购/images/QQ图片20220521162722.png" style="margin-top:20px;" alt="">
            </div>
        </div>
    </div>
<script>
    function gotop(){
        document.documentElement.scrollTop=0;
    }
    loginAndregister();
    function loginAndregister(){
        var userid=localStorage.getItem("id");
        console.log(userid);
        var str1="";
        if(userid==null){
            str1=`
            <div class="nav-regis-login">
                    <div class="nav-login"><a href="../会员购/html/register.html">注册</a></div>
                    <div class="nav-login-middle"></div>
                    <div class="nav-register"><a href="../会员购/html/login.html"  style="text-decoration: none; color:#6c637b">登录</a></div>
                </div>
            </div>
            `
        }else{
            str1=`
            <div class="nav-regis-login">
                    <div class="nav-login">欢迎你，用户：${userid}</div>
                    <div class="nav-login-middle"></div>
                    <div class="nav-register" onclick="localdelet()">退出登录</div>
                </div>
            </div>
            `
        }
        document.querySelector("#logAndreg").innerHTML=str1;
    }
    function localdelet(){
            localStorage.clear();
            location.reload();
        }
    
    var swiper = new Swiper(".mySwiper", {
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: {
          delay: 2500,
          disableOnInteraction: false,
        },
        pagination: {
          el: ".swiper-pagination",
          clickable: true,
        },
        navigation: {
          nextEl: ".swiper-button-next",
          prevEl: ".swiper-button-prev",
        },
      });
      let id = localStorage.getItem("id");
      product();
      function product(){
        var uid = 109040;
        var pagenum = 0;
        var pagesize = 20;
        let url="http://jx.xuzhixiang.top/ap/api/productlist.php";
        let p = axios.get(url, { params: { uid, pagenum, pagesize }});
            p.then((r) => {
                console.log(r.data);
                productArr = r.data.data;
                console.log(productArr);
                var str = "";
                productArr.forEach((pObj) => {
                    str = ` 
                <div class="project-list-item">
                    <a href="../会员购/html/information.html?id=${pObj.pid}" target="_blank"><div class="item-img" style="background-image:url(${pObj.pimg});cursor:pointer;"></div></a> 
                        <div class="item-text">
                            <a href="../会员购/html/information.html?id=${pObj.pid}" style="text-decoration: none;" target="_blank"><div class="text-title" style="cursor:pointer;">${pObj.pname}</div></a> 
                            <div class="text-time">
                                <span class="iconfont icon-shijianweidu" id="shijian"></span>
                                2022.07.15 - 07.17
                            </div>
                        <div class="text-place">
                            <span id="didian" class="iconfont icon-didian"></span>
                            <span>${pObj.pdesc}</span>
                        </div>
                        <div class="text-price">
                            <div class="text-number">
                                <span class="price-symbol">¥</span>
                                <span class="price">${pObj.pprice}</span>
                                <span class="star">起</span>
                                <span class="introduce">独家</span>
                            </div>
                        </div>
                    </div>
                </div>
                    `+str;
                });
                document.querySelector("#pdiv").innerHTML = str;
            });
      }
      function skip(){
          location.href="../会员购/html/information.html?id=${pObj.pid}";
      }
</script>
</body>
</html>